<template>
  <a-row :class="['p-4', `${prefixCls}--box`]" :gutter="10">
    <a-col :xl="6" :lg="8" :md="10" :sm="24" style="flex: 1;">
      <a-card :bordered="false" style="height: 100%">
        <a-row>
          <!-- 上方部分，占50% -->
          <a-col :span="24" style="height: 50%;background-color: green">
            <Calendar :fullscreen="false" />
          </a-col>
          <!-- 下方部分，占50% -->
          <a-col :span="24" style="height: 50%;background-color: red">
            <!-- 这里可以添加其他内容 -->
            <Calendar :fullscreen="false" />
          </a-col>
        </a-row>
      </a-card>
    </a-col>
    <a-col :xl="18" :lg="16" :md="14" :sm="24" style="flex: 1">
      <a-card :bordered="false" style="height: 100%">
<!--        <a-tabs defaultActiveKey="user-info">-->
<!--          <a-tab-pane tab="基本信息" key="base-info" forceRender>-->
<!--          </a-tab-pane>-->
<!--          <a-tab-pane tab="用户信息" key="user-info">-->
<!--          </a-tab-pane>-->
<!--          <a-tab-pane tab="部门角色" key="role-info">-->
<!--          </a-tab-pane>-->
<!--        </a-tabs>-->
      </a-card>
    </a-col>
  </a-row>
</template>

<script lang="ts" setup>
import { provide, ref } from 'vue';
import { useDesign } from '/@/hooks/web/useDesign';
import { Calendar } from 'ant-design-vue';

const { prefixCls } = useDesign('depart-user');
provide('prefixCls', prefixCls);





</script>

<style lang="less" scoped>
.a-row {
  display: flex;
  flex-direction: column;
}
</style>
